import router from '@/router'
import type {ActionContext} from 'vuex'
import config from '@/config'
import deepClone from '@/libs/deepClone'
import {RootState} from '..'
let customRouter = deepClone(config.router) as typeof config.router

export type AsideState = {
  currentAside: CustomRoute
  asideList: CustomRoute[]
}
export type AsideContext = ActionContext<AsideState, RootState>

const state: AsideState = {
  currentAside: customRouter[0],
  asideList: customRouter,
}

const mutations = {
  a: (state: AsideState, data: number) => {
    console.log(data)
  },
  SETAsideList(state: AsideState, data: CustomRoute[]) {
    state.asideList = data
    // console.log('设置了侧边栏数据：', data);
  },
  SETCurrentAside(state: AsideState, data: CustomRoute) {
    if (data) {
      state.currentAside = data
      // console.log('点击右边侧边栏：', data);
    }
  },
}

const actions = {
  HANDLE_asideSplit_click(
    {state, commit, rootGetters}: AsideContext,
    data: {asideSplit: CustomRoute; current?: CustomRoute}
  ) {
    let {asideSplit, current} = data
    commit('SETCurrentAside', asideSplit)
    // 点击最左侧侧边栏
    router.push(current ? current.path : asideSplit.path)
  },
  HANDLE_aside_click(
    {state, commit, rootGetters}: AsideContext,
    data: CustomChildRoute | CustomRoute
  ) {
    // console.log('aside 点击', data);
    router.push({
      name: data.name,
    })
  },
}

const getters = {
  asideList: (state: AsideState) => state.asideList,
  currentAside: (state: AsideState) => state.currentAside,
}

export default {
  namespaced: true, // 声明命名空间
  state,
  mutations,
  actions,
  getters,
}
